<%--
  Created by IntelliJ IDEA.
  User: Adam
  Date: 2022/3/14
  Time: 17:12
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page isELIgnored="false" %>
<!--开启EL表达式-->
<html>
<head>
    <title>按学号查找学生</title>
    <script src="js/jquery-3.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function (){
            //当前页面dom对象加载后，执行loadStudentData()
            // loadStudentData();

            $("#btnloader").click(function () {
                loadStudentData();
            })
        })
        var id = 1;
        function loadStudentData(){
            $.ajax({
                url:"/ch07-ssm/student/findStudentById.do",
                type:"post",
                data:{'id':id},
                dataType:"json",
                success:function (data){
                    //清除旧的数据
                    $("#info").html("");
                    //增加新的数据

                    $("#info").append("<tr>")
                        .append("<td>"+data.id+"</td>")
                        .append("<td>"+data.name+"</td>")
                        .append("<td>"+data.age+"</td>")
                        .append("</tr>")

                }
            })
        }
        
    </script>
</head>
<body>
<div align="center">
    <table>
        <thead>
        <tr>
            <td>学号</td>
            <td>姓名</td>
            <td>年龄</td>
        </tr>
        </thead>
        <tbody id="info">

        </tbody>
        <input type="button" id="btnloader" value="查询数据">
    </table>
</div>
</body>
</html>
